<template>
  <div class="orderList orderLayout">
    <div class="content">
      <div class="nav-bar" style="height:1.2rem;">
      </div>
      <div>
        <div class="list" v-if="orderList.length > 0">
          <div class="list-item" v-for="item in orderList">
            <div @click="next(item.channelId,item.channelName)">
              <div class="product">
                <div class="thumb">
                  <img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/avatar_icon_man.png">
                </div>
                <div class="detail">
                  <li class="fz16 gray">{{item.channelName}}</li>
                  <li class="address"><span>电话：</span><span>{{ item.phone }}</span></li>
                </div>
              </div>
              <div class="amount gray">
                <span><span class="fz12">订单数量</span>&nbsp;&nbsp;<span class="fz16">{{ item.channelOrderNumber}}</span></span>
                <span><span class="fz12">销售金额</span>&nbsp;&nbsp;<span class="fz16">{{ item.sales}}</span></span>
              </div>
              <div class="amount gray">
                <span><span class="fz12">提成比例&nbsp;&nbsp;</span><span class="fz16">{{ item.proportion}}%</span></span>
                <span><span class="fz12"> 贡献积分&nbsp;&nbsp;</span><span class="fz16">{{ item.channelCredit}}</span></span>
              </div>
              <div class="amount_detail">
                <span>不可用积分&nbsp;&nbsp; <span>{{ item.disabledCredit }}</span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                <span>已返现积分&nbsp;&nbsp; <span>{{ item.channelReturnCredit }}</span></span>
              </div>
              <div class="handle">
              </div>
            </div>
          </div>
        </div>
        <div v-else style="text-align: center;" class="list null">
          <span>这里还没有下级渠道哦！</span>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { Toast, Indicator } from 'mint-ui';
import { mapActions, mapGetters } from 'vuex';
import sharePop from "components/sharePop"
import { getRedeemReward } from "api/moneyBack"
import { wxshare } from 'common/mixin'

export default {
  mixins: [wxshare],
  data() {
    return {
      orderList: []
    }
  },
  watch: {
    '$route' (to, from) {
      this.getList();
    }
  },
  methods: {
    ...mapActions({
      LowerChannel: 'LowerChannel',
    }),
    next(id, name) {
      let title = `${name}的下级渠道（我的二级渠道）`
      this.$router.push({ path: '/doctor/lowerChannel', query: { id, name: title } });
    },
    getList() {
      Indicator.open();
      this.LowerChannel({ channelId: this.$route.query.id }).then(result => {
        this.orderList = result.channels;
        Indicator.close();
      }, error => {
        Indicator.close();
      })
    }
  },
  mounted() {
    this.getList();
  },
}
</script>
<style lang="less" scoped>
@import '../order/orderList.less';
@import '../order/orderPre.less';
.orderLayout .content {
    background-image: url(http://cdn.gee4.cn/zw-wx/v0.0.1/img/portalNew/bg-header-background.png)
}
</style>
